/* Common Shortcodes style */

/* Table of Content
==================================================
	0-#Button
	1-#Line
	2-#Columns
	3-#Dropcap
    4-#Toggle
    5-#Tabs
    6-#Lists
    7-#Skills
    8-#Tweets
	*/

/*-----------------------------------------------------------------------------------*/
/*	0.	Button
/*-----------------------------------------------------------------------------------*/
.van_small_btn{
    min-width:50px;
	padding:8px;
	font-size:12px;
}
.van_large_btn{
    min-width:100px;
	padding:10px;
	font-size:18px;
}
.van_largex_btn{
    min-width:100px;
	padding:15px;
	font-size:22px;
}
.van_small_btn,
.van_large_btn,
.van_largex_btn{
	font-weight:bold;
	text-align:center;
	margin:0 5px 5px 0;
	width:auto;
	display:inline-block;
}

@media only screen and (max-width: 640px) {
  .van_large_btn{min-width:60px;font-size:18px}
  .van_largex_btn{min-width:90px;font-size:22px}
}
@media only screen and (max-width: 480px) {
  .van_large_btn{min-width:40px;font-size:16px}
  .van_largex_btn{min-width:60px;font-size:18px}
}

/*-----------------------------------------------------------------------------------*/
/*	1.	Line
/*-----------------------------------------------------------------------------------*/
.line{
   height:1px;
   clear:both;
   margin:20px 0;
   border-top:1px solid #000;
}

/*-----------------------------------------------------------------------------------*/
/*	2.	Columns
/*-----------------------------------------------------------------------------------*/
.column{
  float:left;
  margin-right:4%;
  margin-bottom:4%;
  position:relative;
  overflow:hidden;
  padding-bottom:10px;
}
.one_half{width:48%;}
.one_third{width:30.66%;}
.two_third{width:65.33%;}
.one_fourth{width:22%;}
.two_fourth{width:48%;}
.three_fourth{width:74%;}
/*.one_fifth{width:16.8%;}
.two_fifth{width:37.6%;}
.three_fifth{width:58.4%;}
.four_fifth{width:67.2%;}
.one_sixth{width:13.33%;}
.two_sixth{width:30.66%;}
.three_sixth{width:47.99%;}
.four_sixth{width:65.33%;}
.five_sixth{width:82.67%;}*/
.last{margin-right:0;}
@media only screen and (max-width: 480px) {
 .column{width:100%;}
}
.column img{
     max-width: 100%;
	 width: auto;
	 height: auto;
	 zoom:expression( function(elm) {
	 if (elm.width>100%) {
	 var oldVW = elm.width;
	 elm.width=100%;
	 elm.height = elm.height*(100% /oldVW);
	}
	 elm.style.zoom = '1';
	}
	 (this));
}

/*-----------------------------------------------------------------------------------*/
/*	3.	Dropcap
/*-----------------------------------------------------------------------------------*/
.dropcap{
   float:left;
   margin:-5px 10px 0 0;
   font:bold 36px Georgia, "Times New Roman", Times, serif;
}

/*-----------------------------------------------------------------------------------*/
/*	4.	Toggle
/*-----------------------------------------------------------------------------------*/
.toggle{
   margin-bottom:10px;
   height:auto;
   overflow:hidden;
   clear:both;
}
.toggle .toggle_title{
   line-height:22px;
   padding:10px 10px 10px 10px;
   background:#eee;
   color:#000;
   font-weight:bold;
   cursor:pointer;
   border:1px solid #ddd;
}
.toggle .toggle_title span{
   width:15px;
   height:15px;
   float:left;
   margin:3px 5px 0 0;
   display:inline-block;
   background:url(../images/toggle.png) no-repeat;
}
.toggle .toggle_title span.off{
   background-position:0 0;
}
.toggle .toggle_title span.on{
   background-position:0 -15px;
}
.toggle .toggle_content{
   padding:10px;
   border:1px solid #ddd;
   border-top:0;
}
.toggle .toggle_content.off{
   display:none;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){
  .toggle .toggle_title span{
   background:url(../images/toggle@2x.png) no-repeat;
   background-size:15px auto;
  }
}

/*-----------------------------------------------------------------------------------*/
/*	5.	Tabs
/*-----------------------------------------------------------------------------------*/
.tab_box{
   margin-bottom:10px;
}
.tab_box .tab_items ul{
   margin:0;
   padding:0;
}
.tab_box .tab_items li{
   list-style:none;
   position:relative;
}
.tab_box .tab_items li a{
   display:block;
   padding:0 10px;
   text-align:center;
   margin:0 -1px 0px 0;
   color:#000;
   border:1px solid #ddd;
   background:#eee;
}
.tab_box .tab_items li,
.tab_box .tab_items li a{
   height:34px;
   line-height:34px;
   float:left;
}
.tab_box .tab_items li.cur a{
   background:#fff;
   font-weight:bold;
   margin-bottom:-1px;
   z-index:2;
   height:35px;
   line-height:35px;
   border-bottom:0;
}
.tab_box .tab_content{
   clear:both;
   background:#fff;
   border:1px solid #ddd;
   padding:10px 15px;
   height:auto;
   overflow:hidden;
}

/*-----------------------------------------------------------------------------------*/
/*	6.	Lists
/*-----------------------------------------------------------------------------------*/
.correct ul li{ background:url(../images/check.png) no-repeat 0 4px;}
.error ul li{ background:url(../images/error.png) no-repeat 0 4px;}
.download ul li{ background:url(../images/download.png) no-repeat 0 4px;}
.star ul li{ background:url(../images/star.png) no-repeat 0 2px;}
.correct ul li,
.error ul li,
.download ul li,
.star ul li{
  padding-left:26px;
  list-style:none;
}
.correct ul,.error ul,.download ul,.star ul{
  padding-left:0;
  margin-left:0;
}

/*-----------------------------------------------------------------------------------*/
/*	7.	Skills
/*-----------------------------------------------------------------------------------*/
.skills{
   margin-bottom:20px;
   width:100%;
   overflow:hidden;
   text-transform:uppercase;
   font:bold 14px "Arial Black", Gadget, sans-serif;
}
.skills ul{
   margin:0;
   padding:0;
}
.skills li{
   color:#000;
   margin-bottom:10px;
   background:#ddd;
   text-align:right;
   padding:10px 20px 0px;
   position:relative;
   list-style:none;
}
.skills li,.entry .skills li{
   list-style:none;
}
.skills li span{
   color:#fff;
   float:left;
   text-align:left;
   display:block;
   text-indent:10px;
   padding:5px 0 6px;
   position:absolute;
   top:0;
   left:0;
   z-index:1;
}
@-moz-document url-prefix() {
  .skills li span{padding:10px 20px;}
}

.skills li em{
   z-index:2;
   position:absolute;
   right:10px;
   top:6px;
}

/*-----------------------------------------------------------------------------------*/
/*	8.	Config
/*-----------------------------------------------------------------------------------*/
.config{
	width: 110%;
	height: auto;
	overflow: hidden;
	margin-bottom: 0;
	clear:both;
}
.config .item {
	width: 200px;
	height: 260px;
	overflow: hidden;
	float: left;
	text-align: center;
	margin: 0 40px 30px 0;
	font-size:12px;
}
.config .item .thumbnail {
	height: 100px;
	overflow: hidden;
	margin: 0 auto 20px;
}
.config .item .thumbnail img {
	max-width: 50%;
	max-height: 100px;
	height: auto;
	width: auto;
}
.config .item img {
	margin: 0 auto;
	display: block;
}
.config .item h2 {
	color: #000;
	font: normal 18px 'Oswald' Arial, Helvetica, sans-serif;
	margin: 0 auto 10px;
	text-transform:uppercase;
}